<doctype html>
<html>
<head>
<meta charset="utf-8">
<title>@font-face</title>
  <link rel="stylesheet" charset="utf-8" href="../../base.css" />
   <style type="text/css">
	body{padding:30px;}
    p{margin-bottom:15px;}
    
  /* 按兼容要求配置 src url */
    @font-face {
      font-family: 'JennaSue';/* 字体名，可自定义 */
      src: url('./JennaSue.eot'); /* fix ie9 */
      src: url('./JennaSue.eot?#iefix') format('eot'),/* ie4~ie8*/
           url('./JennaSue.ttf') format('truetype');/* modern browser safari in iOS */
    }
    .sl-fontface {
      font-family: 'JennaSue';
      font-size: 60px;
      line-height: 100px;
    }
    .complete{
        color: #888;
    }
  </style>
</head>

<body>

<div id="wrapper">
  
    <h3>测试字体JennaSue</h3>
    
    <div class="sl-fontface">^Hi,I'm Alice.Just for fun,Oh yeah!</div>
    
    <p class="complete">浏览器兼容性测试通过：[IE6+|Firefox3.5+|Chrome4+|Safari3+|Opera10+|iOS Safari4.2+]</p>
  
</div><!-- #wrapper -->

</body>
</html>
